<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<%--<html:html lang="true">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title><bean:message key="welcome.title"/></title>
        <html:base/>
    </head>
    <body style="background-color: white">
        
        <logic:notPresent name="org.apache.struts.action.MESSAGE" scope="application">
            <div  style="color: red">
                ERROR:  Application resources not loaded -- check servlet container
                logs for error messages.
            </div>
        </logic:notPresent>
        
        <h3><bean:message key="welcome.heading"/></h3>
        <p><bean:message key="welcome.message"/></p>
        
    </body>
</html:html>--%>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
		<title>MasterCard</title>
		<link type="text/css" href="css/styles.css" rel="stylesheet" />
		<script type="text/javascript">
		  WebFontConfig = {
			google: { families: [ 'Lato:100,300,400,700,900:latin' ] }
		  };
		  (function() {
			var wf = document.createElement('script');
			wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
			  '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
			wf.type = 'text/javascript';
			wf.async = 'true';
			var s = document.getElementsByTagName('script')[0];
			s.parentNode.insertBefore(wf, s);
		  })();
                  
                  function valida( )
                    {
                        var str1 = document.getElementById('user').value ;
                        var str2 = document.getElementById('pass').value ;
                        var comp = /^[0-9-A-z]*$/ ;

                    if(  !comp.test( str1 ) )
                        {
                            alert( "Solo debes escribir nuemros y/o letras" ) ;
                            document.getElementById('user').focus( ) ;
                            return false ;
                        }
                    if(  !comp.test( str2 ) )
                        {
                            alert( "Solo debes escribir nuemros y/o letras" ) ;
                            document.getElementById('pass').focus( ) ;
                            return false ;
                        }
                        return true ;
                    }
                    
		</script>
	</head>
	<body>
		<div id="head_promo">
			<img src="images/logoMC.png" alt="MasterCard" />
			<h1>
				&iexcl;ERES UN GANADOR!
				<br />
				<small>Por utilizar tu tarjeta MasterCard&reg;</small>
			</h1>
		</div>
		
		<div id="cont_reg">
			<h3>BIENVENIDO</h3>
			<p>
				Ingresa tu usuario y contrase&ntilde;a para acceder
				<br />
				a la informaci&oacute;n de tu premio.
			</p>
                        <html:form action="Login.do" method="post" onsubmit="return valida(this);">
				<table>                                    
                                        <tr>
                                            <td colspan="2" align="center" class="errors">
                                                <html:errors />
                                            </td>
                                        </tr>
					<tr>
						<td>Usuario:</td>
						<td><input type="text" name="user" id="user" class="txt_input" size="38"/></td>
					</tr>
					<tr>
						<td>Contrase&ntilde;a:</td>
						<td><input type="password" name="pass" id="pass" class="txt_input" size="39"/></td>
					</tr>
					<tr>
						<td colspan="2" align="right"><input type="image" src="images/btn_antrar.png" /></td>
					</tr>
				</table>
			</html:form>
		</div>
		
		<div id="footer">
			&copy; 2012 MasterCard International Incorporated
		</div>
	</body>
</html>
